<template>
  <div class="application-container">
    <header>
      <div class="left">
        <i class="indexBtn" v-if="homeBtn" @click="goHome"></i>
        <i class="backBtn" v-if="backBtn"></i>
      </div>
      <div class="midTitle">
        {{ title }}
      </div>
      <div class="right">
        <i class="addBtn" v-if="addBtn" @click="$emit('addClick')" ></i>
      </div>
    </header>
    <main>
      <slot />
    </main>
  </div>
</template>

<script>
export default {
  methods:{
    goHome(){
      this.$emit('homeClick')
      this.$router.push('/home')
    }
  },
  props: {
    //标题
    title: {
      type: String,
      require: true,
    },
    //回到首页按钮
    homeBtn: {
      type: Boolean,
      default: true,
    },
    //返回按钮
    backBtn: {
      type: Boolean,
      default: false,
    },
    //新增按钮
    addBtn: {
      type: Boolean,
      default: false,
    },
  },
};
</script>